{namespace Movie.soy}

/**
 * This is a Closure Template.
 *
 * To regenerate just English, run:
 *   make movie-en
 *
 * To regenerate all languages, run:
 *   make languages
 */

/**
 * Translated messages for use in JavaScript.
 */
{template .messages}
  {call BlocklyGames.soy.messages /}
  <div style="display: none">
    // Block text and their associated tooltips and URLs (interleaved to
    // assist with translation).
    <span id="Movie_x">{msg meaning="Movie.x" desc="Label for an x-coordinate (horizontal) input."}x{/msg}</span>
    <span id="Movie_y">{msg meaning="Movie.y" desc="Label for a y-coordinate (vertical) input."}y{/msg}</span>
    <span id="Movie_x1">{msg meaning="Movie.x1" desc="Label for the x-coordinate of the start of a line."}start x{/msg}</span>
    <span id="Movie_y1">{msg meaning="Movie.y1" desc="Label for the y-coordinate of the start of a line"}start y{/msg}</span>
    <span id="Movie_x2">{msg meaning="Movie.x2" desc="Label for the x-coordinate of the end of a line."}end x{/msg}</span>
    <span id="Movie_y2">{msg meaning="Movie.y2" desc="Label for the y-coordinate of the end of a line."}end y{/msg}</span>
    <span id="Movie_radius">{{msg meaning="Movie.radius" desc="Label for a circle's radius input.\n{lb}{lb}Identical|Radius{rb}{rb}"}}radius{{/msg}}</span>
    <span id="Movie_width">{{msg meaning="Movie.width" desc="Label for a rectangle or line's width input.\n{lb}{lb}Identical|Width{rb}{rb}"}}width{{/msg}}</span>
    <span id="Movie_height">{{msg meaning="Movie.height" desc="Label for a rectangle's height input.\n{lb}{lb}Identical|Height{rb}{rb}"}}height{{/msg}}</span>
    <span id="Movie_circleTooltip">{msg meaning="Movie.circleTooltip" desc="tooltip"}Draws a circle at the specified location and with the specified radius.{/msg}</span>
    <span id="Movie_circleDraw">{{msg meaning="Movie.circleDraw" desc="Command to draw a circle.\n{lb}{lb}Identical|Circle{rb}{rb}"}}circle{{/msg}}</span>
    <span id="Movie_rectTooltip">{msg meaning="Movie.rectTooltip" desc="tooltip"}Draws a rectangle at the specified location and with the specified width and height.{/msg}</span>
    <span id="Movie_rectDraw">{{msg meaning="Movie.rectDraw" desc="Command to draw a rectangle.\n{lb}{lb}Identical|Rectangle{rb}{rb}"}}rectangle{{/msg}}</span>
    <span id="Movie_lineTooltip">{msg meaning="Movie.lineTooltip" desc="tooltip"}Draws a line from one point to another with the specified width.{/msg}</span>
    <span id="Movie_lineDraw">{{msg meaning="Movie.lineDraw" desc="Command to draw a rectangle.\n{lb}{lb}Identical|Line{rb}{rb}"}}line{{/msg}}</span>

    <span id="Movie_timeTooltip">{msg meaning="Movie.timeTooltip" desc="tooltip"}Returns the current time in the animation (0-100).{/msg}</span>

    <span id="Movie_colourTooltip">{msg meaning="Movie.colourTooltip" desc="tooltip - Changes the colour of ink in the pen carried by the turtle."}Changes the colour of the pen.{/msg}</span>
    <span id="Movie_setColour">{msg meaning="Movie.setColour" desc="block text - Infinitive or imperative of a verb to specify the colour of the lines that should be drawn in the future by an imaginary pen.  This is followed by a block showing the colour"}set colour to{/msg}</span>

    <span id="Movie_submitDisabled">{msg meaning="Movie.submitDisabled" desc="Error message."}Your movie doesn't move. Use blocks to make something interesting. Then you may submit your movie to the gallery.{/msg}</span>
  </div>
{/template}

/**
 * Web page structure.
 */
{template .start}
  {call .messages /}
  <table width="100%">
    <tr>
      <td>
        <h1>
          {call BlocklyGames.soy.titleSpan}
            {param appName}
              {msg meaning="Games.movie" desc="IBID"}Movie{/msg}
            {/param}
          {/call}
          {call BlocklyGames.soy.levelLinks}
            {param level: $ij.level /}
            {param maxLevel: $ij.maxLevel /}
            {param lang: $ij.lang /}
            {param suffix}{/param}
          {/call}
        </h1>
      </td>
      <td class="farSide">
        <select id="languageMenu"></select>
        &nbsp;
        <button id="linkButton" title="{msg meaning="Games.linkTooltip" desc="IBID"}Save and link to blocks.{/msg}">
          <img src="common/1x1.gif" class="link icon21">
        </button>
        &nbsp;
        <button id="helpButton">
          {{msg meaning="Games.help" desc="IBID"}}Help{{/msg}}
        </button>
      </td>
    </tr>
  </table>
  <div id="visualization">
    <div id="coordinates">
      <span id="x"></span>
      <span id="y"></span>
    </div>
    <canvas id="scratch" width="400" height="400" style="display: none"></canvas>
    <canvas id="hatching" width="400" height="400" style="display: none"></canvas>
    <canvas id="axies" width="400" height="400" style="display: none" dir="ltr"></canvas>
    <canvas id="display" width="400" height="400" style="vertical-align: bottom"></canvas>
  </div>
  <svg
      id="scrubber"
      xmlns="http://www.w3.org/2000/svg"
      xmlns:svg="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink"
      version="1.1"
      width="402" height="24">
    <image xlink:href="movie/youtube-bg.png" height=25 width=402 x=0 y=-1 />
  </svg>
  {if $ij.level == 10 and not $ij.html}
  <table style="padding-top: 1em; width: 400px;">
    <tr>
      <td style="text-align: center;">
        <form action="/gallery" target="movie-gallery">
          <input type="hidden" name="app" value="movie">
          <input type="hidden" name="lang" value="{$ij.lang}">
          <button type="submit" title="{msg meaning="Movie.galleryTooltip" desc="tooltip - Pressing this button opens a gallery of movies made by other users."}Open the gallery of movies.{/msg}">
            <img src="common/1x1.gif" class="gallery icon21"> {msg meaning="Movie.galleryMsg" desc="Label on a button that opens a gallery of movies made by other users."}See Gallery{/msg}
          </button>
        </form>
      </td>
      <td style="text-align: center;">
        <button id="submitButton" title="{msg meaning="Movie.submitTooltip" desc="tooltip - Pressing this button causes the movie created by the user's program to be submitted to a gallery for other people to see."}Submit your movie to the gallery.{/msg}">
          <img src="common/1x1.gif" class="camera icon21"> {msg meaning="Movie.submitMsg" desc="Label on a button that submits the user's movie to a public gallery."}Submit to Gallery{/msg}
        </button>
      </td>
    </tr>
  </table>
  <div id="galleryDialog" class="dialogHiddenContent">
     <form id="galleryForm" action="/gallery-api/submit" method="post" onsubmit="return false">
      <header>{msg meaning="Movie.submitTooltip" desc="IBID"}Submit your movie to the gallery.{/msg}</header>
      <canvas id="thumbnail" width="200" height="200"></canvas>
      <input type="hidden" name="app" value="movie">
      <input id="galleryThumb" type="hidden" name="thumb">
      <input id="galleryXml" type="hidden" name="xml">
      <div>
        {msg meaning="Games.submitTitle" desc="IBID"}Title:{/msg}
        {sp}
        <input id="galleryTitle" type="text" name="title" required>
      </div>

      <div class="farSide">
        <button id="galleryCancel" type="button">
          {{msg meaning="Games.dialogCancel" desc="IBID"}}Cancel{{/msg}}
        </button>
        <button id="galleryOk" class="secondary" type="submit">
          {{msg meaning="Games.dialogOk" desc="IBID"}}OK{{/msg}}
        </button>
      </div>
    </form>
  </div>
  {/if}

  {call .toolbox /}
  <div id="blockly"></div>

  {call BlocklyGames.soy.dialog /}
  {call BlocklyGames.soy.doneDialog /}
  {call BlocklyGames.soy.abortDialog /}
  {call BlocklyGames.soy.storageDialog /}

  {if $ij.level == 9}
    <div id="helpLayer" class="dialogHiddenContent">
      <div style="padding-bottom: 0.7ex">
        {msg meaning="Movie.helpLayer" desc="Dialog telling user to change the order of their program."}
          Move the background circle to the top of your program.  Then it will appear behind the person.
        {/msg}
      </div>
      {call BlocklyGames.soy.ok /}
    </div>
  {/if}

  <div id="help" class="dialogHiddenContent">
    <div style="padding-bottom: 0.7ex">
      {if $ij.level == 1}
        {msg meaning="Movie.helpText1" desc="Instructions."}
          Use simple shapes to draw this person.
        {/msg}
      {elseif $ij.level == 2}
        {msg meaning="Movie.helpText2a" desc="Instructions.  The play button looks like the video play button on YouTube."}
          This level is a movie. You want the person's arm to move across the screen. Press the play button to see a preview.
        {/msg}
        <div id="sampleHelp2" class="readonly"></div>
        {msg meaning="Movie.helpText2b" desc="Instructions.  Do not translate the word 'time' or the name 'y'."}
          As the movie plays, the value of the 'time' block counts from 0 to 100. Since you want the 'y' position of the arm to start at 0 and go to 100 this should be easy.
        {/msg}
      {elseif $ij.level == 3}
        {msg meaning="Movie.helpText3" desc="Instructions.  Do not translate the word 'time' or the name 'y'."}
          The 'time' block counts from 0 to 100. But now you want the 'y' position of the other arm to start at 100 and go to 0. Can you figure out a simple mathematical formula that flips the direction?
        {/msg}
      {elseif $ij.level == 4}
        {msg meaning="Movie.helpText4" desc="Instructions."}
          Use what you learned in the previous level to make legs that cross.
        {/msg}
      {elseif $ij.level == 5}
        {msg meaning="Movie.helpText5" desc="Instructions."}
          The mathematical formula for the arm is complicated. Here's the answer:
        {/msg}
        <br><br>
        <code class="ltr">y = ((time - 50) &divide; 5) ^ 2</code>
        <code class="rtl">&lrm;2 ^ (5 &divide; (50 - time)) = y&lrm;</code>
      {elseif $ij.level == 6}
        {msg meaning="Movie.helpText6" desc="Instructions.  Drawing hands on a picture of a person."}
          Give the person a couple of hands.
        {/msg}
      {elseif $ij.level == 7}
        {msg meaning="Movie.helpText7" desc="Instructions.  Do translate the word 'if'."}
          Use the 'if' block to draw a small head for the first half of the movie. Then draw a big head for the second half of the movie.
        {/msg}
      {elseif $ij.level == 8}
        {msg meaning="Movie.helpText8" desc="Instructions."}
          Make the legs reverse direction half way through the movie.
        {/msg}
      {elseif $ij.level == 9}
        {msg meaning="Movie.helpText9" desc="Instructions."}
          Draw an expanding circle behind the person.
        {/msg}
      {elseif $ij.level == 10}
        {msg meaning="Movie.helpText10" desc="Instructions."}
          Make a movie of anything you want. You've got a huge number of new blocks you can explore. Have fun!
        {/msg}
        {if not $ij.html}
          <br><br>
          {msg meaning="Movie.helpText10Reddit" desc="Instructions on publishing your movie."}
            Use the "See Gallery" button to see movies that other people have made. If you make an interesting movie, use the "Submit to Gallery" button to publish it.
          {/msg}
        {/if}
      {/if}
    </div>
    {call BlocklyGames.soy.ok /}
  </div>
{/template}

/**
 * Toolbox.
 */
{template .toolbox}
  <xml id="toolbox" xmlns="https://developers.google.com/blockly/xml">
    <category name="{msg meaning="Games.movie" desc="IBID"}Movie{/msg}">
      <block type="movie_circle">
        <value name="X">
          <shadow type="math_number">
            <field name="NUM">50</field>
          </shadow>
        </value>
        <value name="Y">
          <shadow type="math_number">
            <field name="NUM">50</field>
          </shadow>
        </value>
        <value name="RADIUS">
          <shadow type="math_number">
            <field name="NUM">10</field>
          </shadow>
        </value>
      </block>
      <block type="movie_rect">
        <value name="X">
          <shadow type="math_number">
            <field name="NUM">50</field>
          </shadow>
        </value>
        <value name="Y">
          <shadow type="math_number">
            <field name="NUM">50</field>
          </shadow>
        </value>
        <value name="WIDTH">
          <shadow type="math_number">
            <field name="NUM">10</field>
          </shadow>
        </value>
        <value name="HEIGHT">
          <shadow type="math_number">
            <field name="NUM">10</field>
          </shadow>
        </value>
      </block>
      <block type="movie_line">
        <value name="X1">
          <shadow type="math_number">
            <field name="NUM">40</field>
          </shadow>
        </value>
        <value name="Y1">
          <shadow type="math_number">
            <field name="NUM">40</field>
          </shadow>
        </value>
        <value name="X2">
          <shadow type="math_number">
            <field name="NUM">60</field>
          </shadow>
        </value>
        <value name="Y2">
          <shadow type="math_number">
            <field name="NUM">60</field>
          </shadow>
        </value>
        <value name="WIDTH">
          <shadow type="math_number">
            <field name="NUM">1</field>
          </shadow>
        </value>
      </block>
      {if $ij.level > 1}
        <block type="movie_time"></block>
      {/if}
    </category>
    <category name="{msg meaning="Games.catColour" desc="IBID"}Colour{/msg}">
      <block type="movie_colour">
        <value name="COLOUR">
          <shadow type="colour_picker"></shadow>
        </value>
      </block>
      {if $ij.level == 10}
        <block type="colour_picker"></block>
        <block type="colour_rgb">
          <value name="RED">
            <shadow type="math_number">
              <field name="NUM">100</field>
            </shadow>
          </value>
          <value name="GREEN">
            <shadow type="math_number">
              <field name="NUM">50</field>
            </shadow>
          </value>
          <value name="BLUE">
            <shadow type="math_number">
              <field name="NUM">0</field>
            </shadow>
          </value>
        </block>
        <block type="colour_blend">
          <value name="COLOUR1">
            <shadow type="colour_picker">
              <field name="COLOUR">#ff0000</field>
            </shadow>
          </value>
          <value name="COLOUR2">
            <shadow type="colour_picker">
              <field name="COLOUR">#3333ff</field>
            </shadow>
          </value>
          <value name="RATIO">
            <shadow type="math_number">
              <field name="NUM">0.5</field>
            </shadow>
          </value>
        </block>
      {/if}
    </category>
    {if $ij.level > 6}
      <category name="{msg meaning="Games.catLogic" desc="IBID"}Logic{/msg}">
        <block type="controls_if">
        {if $ij.level < 10}
          <mutation else="1"></mutation>
        {/if}
        </block>
        <block type="logic_compare"></block>
        {if $ij.level == 10}
          <block type="logic_operation"></block>
          <block type="logic_negate"></block>
          <block type="logic_boolean"></block>
          <block type="logic_ternary"></block>
        {/if}
      </category>
    {/if}
    {if $ij.level == 10}
      <category name="{msg meaning="Games.catLoops" desc="IBID"}Loops{/msg}">
        <block type="controls_whileUntil"></block>
        <block type="controls_for">
          <value name="FROM">
            <shadow type="math_number">
              <field name="NUM">1</field>
            </shadow>
          </value>
          <value name="TO">
            <shadow type="math_number">
              <field name="NUM">10</field>
            </shadow>
          </value>
          <value name="BY">
            <shadow type="math_number">
              <field name="NUM">1</field>
            </shadow>
          </value>
        </block>
        <block type="controls_flow_statements"></block>
      </category>
    {/if}
    {if $ij.level > 2}
     <category name="{msg meaning="Games.catMath" desc="IBID"}Math{/msg}">
       <block type="math_number"></block>
       <block type="math_arithmetic">
         <value name="A">
           <shadow type="math_number">
             <field name="NUM">1</field>
           </shadow>
         </value>
         <value name="B">
           <shadow type="math_number">
             <field name="NUM">1</field>
           </shadow>
         </value>
       </block>
       {if $ij.level == 10}
         <block type="math_single">
           <value name="NUM">
             <shadow type="math_number">
               <field name="NUM">9</field>
             </shadow>
           </value>
         </block>
         <block type="math_trig">
           <value name="NUM">
             <shadow type="math_number">
               <field name="NUM">45</field>
             </shadow>
           </value>
         </block>
         <block type="math_constant"></block>
         <block type="math_number_property">
           <value name="NUMBER_TO_CHECK">
             <shadow type="math_number">
               <field name="NUM">0</field>
             </shadow>
           </value>
         </block>
         <block type="math_round">
           <value name="NUM">
             <shadow type="math_number">
               <field name="NUM">3.1</field>
             </shadow>
           </value>
         </block>
         <block type="math_modulo">
           <value name="DIVIDEND">
             <shadow type="math_number">
               <field name="NUM">64</field>
             </shadow>
           </value>
           <value name="DIVISOR">
             <shadow type="math_number">
               <field name="NUM">10</field>
             </shadow>
           </value>
         </block>
         <block type="math_constrain">
           <value name="VALUE">
             <shadow type="math_number">
               <field name="NUM">50</field>
             </shadow>
           </value>
           <value name="LOW">
             <shadow type="math_number">
               <field name="NUM">1</field>
             </shadow>
           </value>
           <value name="HIGH">
             <shadow type="math_number">
               <field name="NUM">100</field>
             </shadow>
           </value>
         </block>
       {/if}
     </category>
    {/if}
    {if $ij.level == 10}
      <category name="{msg meaning="Games.catLists" desc="IBID"}Lists{/msg}">
        <block type="lists_create_with">
          <mutation items="0"></mutation>
        </block>
        <block type="lists_create_with"></block>
        <block type="lists_repeat">
          <value name="NUM">
            <shadow type="math_number">
              <field name="NUM">5</field>
            </shadow>
          </value>
        </block>
        <block type="lists_length"></block>
        <block type="lists_isEmpty"></block>
        <block type="lists_indexOf">
          <value name="VALUE">
            <block type="variables_get">
              <field name="VAR">list</field>
            </block>
          </value>
        </block>
        <block type="lists_getIndex">
          <value name="VALUE">
            <block type="variables_get">
              <field name="VAR">list</field>
            </block>
          </value>
        </block>
        <block type="lists_setIndex">
          <value name="LIST">
            <block type="variables_get">
              <field name="VAR">list</field>
            </block>
          </value>
        </block>
        <block type="lists_getSublist">
          <value name="LIST">
            <block type="variables_get">
              <field name="VAR">list</field>
            </block>
          </value>
        </block>
        <block type="lists_sort"></block>
        <block type="lists_reverse"></block>
      </category>
      <sep></sep>
      <category name="{msg meaning="Games.catVariables" desc="IBID"}Variables{/msg}" custom="VARIABLE"></category>
      <category name="{msg meaning="Games.catProcedures" desc="IBID"}Functions{/msg}" custom="PROCEDURE"></category>
    {/if}
  </xml>
{/template}
